<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
   <script>
    //  先写最基本的 然后再处理
    //  模拟获取 用户数据 -> 订单数据 -> 商品数据
    // 获取用户数据
    function getUsers() {
      setTimeout(() => {
        let data = '用户数据'
        // 调用next方法 并且将数据传入
        a.next(data) //这是第二次调用next 根据我们之前所学 它的实参会作为第一个yield语句返回的结果
      }, 1000);
    }
    // 获取订单数据
    function getOrders() {
      setTimeout(() => {
        let data = '订单数据'
        a.next(data)
      }, 1000);
    }
    // 获取商品数据
    function getGoods() {
      setTimeout(() => {
        let data = '商品数据'
        a.next(data)
      }, 1000);
    }

    // 肯定有同学会这样想 但是这样做不行 因为不符合实际 这些数据是有关联度的 有了用户才有订单 有了订单 才有商品数据 所以说 不能够直接这样去掉 这样在真实场景里是得不到结果的 要按照顺序去进行
    // getUsers()
    // getOrders()
    // getGoods()

    // 生成器函数
    function * gen() {
      let users = yield getUsers()
      console.log(users);
      let orders = yield getOrders()
      console.log(orders);
      let goods = yield getGoods()
      console.log(goods);
    }

    // 调用生成器函数
    let a = gen()
    a.next() //这样做 会运行第一段 但是这样做有一个问题 数据在上面的函数里面放着 我们没有办法做操作 怎么办呢？ 去getUsers里调用next方法 将数据传入
   </script>
</body>
</html>